{% load staticfiles %}
{% load myfilter %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc.">
    <meta name="author" content="Coderthemes">

    <link rel="shortcut icon" href="{% static '' %}velonic/img/favicon_1.ico">

    <title>店铺监控</title>

    <!-- DataTables -->
        <link href="{% static '' %}velonic/css/datatables/jquery.dataTables.min.css" rel="stylesheet" type="text/css" />
        <link href="{% static '' %}velonic/css/datatables/buttons.bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="{% static '' %}velonic/css/datatables/fixedHeader.bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="{% static '' %}velonic/css/datatables/responsive.bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="{% static '' %}velonic/css/datatables/scroller.bootstrap.min.css" rel="stylesheet" type="text/css" />


    <!-- Bootstrap core CSS -->
    <link href="{% static '' %}velonic/css/bootstrap.min.css" rel="stylesheet">
    <link href="{% static '' %}velonic/css/bootstrap-reset.css" rel="stylesheet">

    <!--Animation css-->
    <link href="{% static '' %}velonic/css/animate.css" rel="stylesheet">

    <!--Icon-fonts css-->
    <link href="{% static '' %}velonic/css/font-awesome.css" rel="stylesheet" />
    <link href="{% static '' %}velonic/css/ionicons.min.css" rel="stylesheet" />
    <link href="{% static '' %}velonic/css/material-design-iconic-font.min.css" rel="stylesheet" />

    <!--Morris Chart CSS -->
    <link rel="stylesheet" href="{% static '' %}velonic/css/morris.css">

    <!-- sweet alerts -->
    <link href="{% static '' %}velonic/css/sweet-alert.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="{% static '' %}velonic/css/style.css" rel="stylesheet">
    <link href="{% static '' %}velonic/css/helper.css" rel="stylesheet">



    <!-- HTML5 shim and Respond.js IE8 support of HTML5 tooltipss and media queries -->
    <!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
    <script src="js/respond.min.js"></script>
    <![endif]-->


</head>


<body>

<!-- Aside Start-->
{% include 'velonic/block/side_nav.html' %}
<!-- Aside Ends-->


<!--Main Content Start -->
<section class="content">

<!-- Header -->
{% include 'velonic/block/header.html' %}
<!-- Header Ends -->


<!-- Page Content Start -->
<!-- ================== -->

<div class="wraper container-fluid">
<div class="page-title">
    <h3 class="title">店铺监控
    </h3>
</div>




<div class="row">
    <div class="col-lg-3 col-sm-6">
        <div class="tile-stats white-bg">
            <div class="status">
                <h3 class="m-t-0"><span class="counter">{{ storeList.count }}</span></h3>
                <p>个店铺</p>
            </div>
            <div class="chart-inline">
                <span class="inlinesparkline"></span>
            </div>
        </div>
    </div>

    <div class="col-lg-3 col-sm-6">
        <div class="tile-stats white-bg">
            <div class="status">
                <h3 class="m-t-0 counter">{{ products.count }}</h3>
                <p>款热销产品</p>
            </div>
            <span class="dynamicbar-big"></span>
        </div>
    </div>

</div>


<!-- WEATHER -->

<div class="page-title">
    <h3 class="title">热销新品
    </h3>
</div>
<div class="row">
                            <div class="col-md-12">
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <div>上架时间 ：
                                             <select name="shangjia" id="shangjia">
                                         <option value="3" {% ifequal sj '3' %}selected{% endifequal %}>3天</option>
                                         <option value="5" {% ifequal sj '5' %}selected{% endifequal %}>5天</option>
                                         <option value="7" {% ifequal sj '7' %}selected{% endifequal %}>7天</option>
                                         <option value="10" {% ifequal sj '10' %}selected{% endifequal %}>10天</option>
                                         <option value="15" {% ifequal sj '15' %}selected{% endifequal %}>15天</option>
                                         <option value="30" {% ifequal sj '30' %}selected{% endifequal %}>30天</option>
                                     </select>
                                     </div>
                                    </div>
                                    <div class="panel-body">

                                        <table id="datatable-buttons" class="table table-striped table-bordered">
                                            <thead>
                                                <tr>
                                                    <th>主图</th>
                                                    <th>标题</th>
                                                    <th>价格</th>
                                                    <th>订单数</th>
                                                    <th>上架时间</th>
                                                    <th>店铺名</th>
                                                    <th>#操作</th>
                                                </tr>
                                            </thead>


                                            <tbody class="sjtable">
            {% for product in products %}
              <tr id="yc-{{ product.product_id }}">
                <td><a href="{% url 'product_info' product.product_id %}" target="_blank" class="preview" data-src="{{ product.thumb }}"><img data-src="{{ product.thumb }}" class="img-thumbnail" alt="{{ product.title }}" src="{{ product.thumb }}" data-holder-rendered="true" style="width: 60px; height: 60px;"></a></td>
                <td><div style="max-width: 300px;">{{ product.product_title }}</div></td>
                <td class="price-{{ product.product_id }}{% if product.low_price %}{% else %} loading{% endif %}">
                    {% if product.low_price %}{{ product.low_price|calPrice:product.discount }}{% endif %}</td>
                <td class="order-{{ product.product_id }}">{{ product.orders }}</td>
                <td class="time-{{ product.product_id }}">{{ product.add_date|date:"Y-m-d"  }}</td>
                <td><a href="{% url 'products' %}?store={{ product.store_id }}" target="_blank" >{{ product.store_id|storeId2name }}</a></td>
                <td sta-{{ product.product_id }}>
                                                {% if product.is_remove %}
                                                    <p>产品已经下架<br></p>
                                                {% else %}
                                                    {% if product.status %}<button id="s-{{ product.product_id }}" class="btn btn-icon btn-success m-b-4"><i class="fa fa-check-circle"></i></button>{% else %}<button id="s-{{ product.product_id }}" onclick="get_product('{{ product.product_id }}')" class="btn btn-icon btn-purple m-b-4"><i class="zmdi zmdi-play-circle"></i></button> {% endif %}
                                                  {% if product.status_trans %}<button id="s2-{{ product.product_id }}" class="btn btn-icon btn-success m-b-4"><i class="fa fa-check-circle"></i></button>{% else %} <button id="s2-{{ product.product_id }}" onclick="get_transactions('{{ product.product_id }}')" class="btn btn-icon btn-inverse m-b-4"><i class="zmdi zmdi-play-circle"></i></button>{% endif %}{% endif %}
                                              </td>
              </tr>
            {% endfor %}
            </tbody>



                                        </table>

                                    </div>
                                </div>
                            </div>

                        </div> <!-- End Row -->

</div>
<!-- Page Content Ends -->
<!-- ================== -->

<!-- Footer Start -->
{% include 'velonic/block/footer.html' %}
<!-- Footer Ends -->



</section>
<!-- Main Content Ends -->








<!-- js placed at the end of the document so the pages load faster -->
<script src="{% static '' %}velonic/js/jquery.js"></script>
<script src="{% static '' %}velonic/js/bootstrap.min.js"></script>
<script src="{% static '' %}velonic/js/modernizr.min.js"></script>
<script src="{% static '' %}velonic/js/pace.min.js"></script>
<script src="{% static '' %}velonic/js/wow.min.js"></script>
<script src="{% static '' %}velonic/js/jquery.scrollTo.min.js"></script>
<script src="{% static '' %}velonic/js/jquery.nicescroll.js" type="text/javascript"></script>

<!-- Counter-up -->
<script src="{% static '' %}velonic/js/waypoints.min.js" type="text/javascript"></script>
<script src="{% static '' %}velonic/js/jquery.counterup.min.js" type="text/javascript"></script>

<!-- sparkline -->
<script src="{% static '' %}velonic/js/jquery.sparkline.min.js" type="text/javascript"></script>
<script src="{% static '' %}velonic/js/chart-sparkline.js" type="text/javascript"></script>

<!-- skycons -->
<script src="{% static '' %}velonic/js/skycons.min.js" type="text/javascript"></script>

<!--Morris Chart-->
 <script src="{% static '' %}velonic/js/sweet-alert.min.js"></script>


<script src="{% static '' %}velonic/js/jquery.app.js"></script>

<!-- Dashboard -->

<!-- Datatables-->
        <script src="{% static '' %}velonic/js/datatables/jquery.dataTables.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/dataTables.bootstrap.js"></script>
        <script src="{% static '' %}velonic/js/datatables/dataTables.buttons.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/buttons.bootstrap.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/jszip.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/pdfmake.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/vfs_fonts.js"></script>
        <script src="{% static '' %}velonic/js/datatables/buttons.html5.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/buttons.print.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/dataTables.fixedHeader.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/dataTables.keyTable.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/dataTables.responsive.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/responsive.bootstrap.min.js"></script>
        <script src="{% static '' %}velonic/js/datatables/dataTables.scroller.min.js"></script>

<!-- Datatable init js -->
        <script src="{% static '' %}velonic/js/datatables.init.js"></script>

        <script src="{% static '' %}velonic/js/preview.js"></script>

        <script type="text/javascript">
            $(function(){
                if($('a.preview').length){
                    var img = preloadIm();
                    imagePreview(img);
                }
            })
        </script>


<script type="text/javascript">
    $(".loading").html('<img src="{% static "images/loading_sm.gif" %}" width=50 />');
    function get_transactions(productId){
          //alert("开始采集交易记录。。。");
          swal({
            title: "采集任务即将执行!",
            text: "3秒后开始采集.",
            timer: 3000,
            showConfirmButton: false
        });
          $.post("{% url 'aliexpress:signle_product_transactions' %}",{productId:productId},function(result){
              //$("span").html(result);
              if(result.error==1){
                  //alert(result.msg);
                  swal("失败", result.msg, "error");
                  return false;
              }else{
                  $(".time-"+productId).html(result.add_date);
                  var s = $("#s2-"+productId);
                  s.removeClass('btn-inverse');
                  s.addClass('btn-success');
                  s.html('<i class="fa fa-check-circle"></i>');
                  s.removeAttr('onclick');
                   swal("采集完毕!");
              }
          });
      }

      function get_product(productId){
          swal({
            title: "采集任务即将执行!",
            text: "3秒后开始采集.",
            timer: 3000,
            showConfirmButton: false
        });
          $.post("{% url 'aliexpress:signle_product_detail' %}",{productId:productId},function(result){
              if(result.error==1){
                  //alert(result.msg);
                  swal("失败", result.msg, "error");
                  return false;
              }else{
                  if(result.lowPrice == result.highPrice){
                      $(".price-"+productId).html((result.lowPrice).toFixed(2));
                  }else{
                      $(".price-"+productId).html((result.lowPrice).toFixed(2)+' - '+(result.highPrice).toFixed(2));
                  }

                  $(".order-"+productId).html(result.orders);
                  var s = $("#s-"+productId);
                  s.removeClass('btn-purple');
                  s.addClass('btn-success');
                  s.html('<i class="fa fa-check-circle"></i>');
                  s.removeAttr('onclick');
                  //alert("采集完毕。。。");
                  swal("采集完毕!");
              }
          });
      }

    $('#shangjia').change(function(){
                var sj = $(this).children('option:selected').val();
                var url = '?sj='+sj;
        {% if st %} url +='&st={{ st }}'{% endif %}
                window.location.href=url;//页面跳转并传参

            });


    jQuery(document).ready(function($) {
        /* Counter Up */
        $('.counter').counterUp({
            delay: 100,
            time: 1200
        });
    });
    /* BEGIN SVG WEATHER ICON */
    if (typeof Skycons !== 'undefined'){
        var icons = new Skycons(
                        {"color": "#fff"},
                        {"resizeClear": true}
                ),
                list  = [
                    "clear-day", "clear-night", "partly-cloudy-day",
                    "partly-cloudy-night", "cloudy", "rain", "sleet", "snow", "wind",
                    "fog"
                ],
                i;

        for(i = list.length; i--; )
            icons.set(list[i], list[i]);
        icons.play();
    };
</script>

<script type="text/javascript">

            var dtTranslate={//下面是一些汉语翻译
                "sSearch": "搜索",
                "sLengthMenu": "每页显示 _MENU_",
                "sZeroRecords": "没有检索到数据",
                "sInfo": "显示 _START_ 至 _END_ 条 &nbsp;&nbsp;共 _TOTAL_ 条 &nbsp;&nbsp;",
                "sInfoFiltered": "(筛选自 _MAX_ 条数据)",
                "sInfoEmtpy": "没有数据",
                "sProcessing": "<img src='/public/images/loading.gif' /> 数据加载中...",
                "oPaginate":
                            {
                                "sFirst": "首页",
                                "sPrevious": "前一页",
                                "sNext": "后一页",
                                "sLast": "末页"
                            }
            }


            $(document).ready(function() {
                $('#datatable').dataTable({"oLanguage": dtTranslate});
                $('#datatable-responsive').DataTable({"oLanguage": dtTranslate});
                $('#datatable-buttons').DataTable();
                $('#table-evaluate').DataTable({"oLanguage": dtTranslate});
                var table = $('#datatable-fixed-header').DataTable( { fixedHeader: true,"oLanguage": dtTranslate } );
            } );
            TableManageButtons.init();





        </script>


{% include 'velonic/block/footer_comm.html' %}


</body>
</html>
